<template>
	<div>
		<h3 class="aside-title">关于我</h3>
		<div v-highlight class="post-entry" style="margin-top: 10px;" v-html="makeHtml(author.content)"></div>
	</div>
</template>

<script>
	// 创建showdown实例（实现markdown转html）
	var converter = new showdown.Converter();
	module.exports = {
		name: "about",
		props: ['route'],
		data() {
			return {
				author: {
					/*路由*/
					route: '',
					/*标题*/
					title: '',
					/*变更时间*/
					changeTime: '',
					/*作者*/
					author: '',
					/*内容*/
					content: '',
					/*点赞量*/
					praise: '',
					/*总浏览量*/
					pageViews: '',
				}
			}
		}, //在这里调用ajax请求方法
		created() {
			this.loadBlog();
		},
		// 定义自定义指令 v-highlight 代码高亮
		directives: {
			highlight: {
				update(el) {
					let blocks = el.querySelectorAll("pre code");
					blocks.forEach((block) => {
						hljs.highlightBlock(block);
					});
				},
			},
		},
		methods: {
			loadBlog() {
				let this_ = this;
				axios.get('./blog/author.md', {
					params: {}
				}).then(function(response) {
					if (response.status == 200) {
						this_.author.content = response.data;
					} else {
						layer.msg('请求失败', {
							time: 1500
						});
					}
				}).catch(function(error) {
					console.log(error);
				});
			},
			makeHtml(text) {
				return converter.makeHtml(text);
			},
		},
	}
</script>

<style scoped>
</style>
